﻿@model IList<Sealight.Core.DataAdapter.related_product>
@{
    Layout = null;
}

<script language="javascript" type="text/javascript">
    function closePopupRelateProduct() {
        //disablePopup('#AddRelatedProductContainer');
        var windowElement = $('#RelatedProductContainer');
        windowElement.data('tWindow').close();
    }
    $(function () {

        $('.addProductRelate').click(function () {
            //centerDocumentPopup('#AddRelatedProductContainer');
            //loadPopup('#AddRelatedProductContainer');

            var windowElement = $('#RelatedProductContainer');
            windowElement.data('tWindow').center().open();
        });
        $('.closeRelateProduct').click(function () {
            closePopupRelateProduct();
        });
        $('#btnSearchRelatedProduct').click(function () {

            var productName = $('#product_name').val();
            var categoryId = $('#category_name').val();

            if (productName == '') return;

            $.ajax({
                type: "POST",
                url: "/admin/product/_SearchProduct",
                data: ({ productName: productName, categoryId: categoryId }),
                dataType: "json",
                error: function (xhr, status, error) { },
                success: function (data) {
                    if (data != null) {
                        if (data.OperationComplete != null && data.OperationComplete == false && data.ErrorCode != null) {
                            if (data.ErrorFriendlyMessage != null) {
                                ShowErrorMessage(data.ErrorFriendlyMessage);
                            }
                            return;
                        }
                        var tableData = $('#result_list_related_products tbody');
                        tableData.empty();
                        if (data != null && data.length > 0) {

                            for (var i = 0; i < data.length; i++) {
                                var tr = '<tr class="rowstyle"><td style="width: 60%;">' + data[i].name + '</td><td>  <span title="Mark this product as a related product"> <input type="checkbox" product-id="' + data[i].id + '" /> </span></td></tr>'
                                tableData.append(tr);

                            }
                        }
                    }
                },
                complete: function (d) {
                },
                cache: false
            }); //end .ajax call

        });

        $('#btnSaveRelatedProduct').click(function () {
            var productId = $('#product_id').val();
            var data = [];
            $('input[type="checkbox"]', $('#result_list_related_products')).each(function () {
                if ($(this).is(':checked')) {
                    var productId = $(this).attr('product-id');
                    if ($('input[type="hidden"][id="rel-' + productId + '"]', $('#list_related_product')).length == 0) {
                        data.push(productId);
                    }
                }
            });

            if (data != null && data.length > 0) {
                JsUtils.ShowLoader('#result_list_related_products', '');
                $.ajax({
                    type: "POST",
                    url: "/admin/product/_SaveRelatedProduct?id=" + productId,
                    data: JSON.stringify(data),
                    traditional: true,
                    dataType: "json",
                    contentType: 'application/json',
                    error: function (xhr, status, error) { },
                    success: function (d) {
                        if (d != null) {
                            if (d.OperationComplete != null && d.OperationComplete == false && d.ErrorCode != null) {
                                if (d.ErrorFriendlyMessage != null) {
                                    ShowErrorMessage(d.ErrorFriendlyMessage);
                                }
                                return;
                            }
                            ShowErrorMessage("Lưu thành công", "thông báo");
                            closePopupRelateProduct();

                            JsUtils.ShowLoader('#tabs-6', '');
                            $('#tabs-6').load('/admin/product/ListRelateProduct?productId=' + productId, function () {

                                JsUtils.hideLoader('#tabs-6');

                            });
                        }
                    },
                    complete: function (d) {
                        JsUtils.hideLoader('#result_list_related_products');
                    },
                    cache: false
                }); //end .ajax call
            }
        });

        $('.delete-relate-product', $('#list_related_product')).click(function () {

            var relateProductId = $(this).attr('relate-product-id');
            var _that = this;

            JsUtils.ShowLoader('#list_related_product', '');
            $.ajax({
                type: "POST",
                url: "/admin/product/_RemoveRelatedProduct",
                data: ({ relateProductId: relateProductId }),
                dataType: "json",
                error: function (xhr, status, error) { },
                success: function (d) {
                    if (d != null) {
                        if (d.OperationComplete != null && d.OperationComplete == false && d.ErrorCode != null) {
                            if (d.ErrorFriendlyMessage != null) {
                                ShowErrorMessage(d.ErrorFriendlyMessage);
                            }
                            return;
                        }
                        ShowErrorMessage("Xóa thành công", "thông báo");

                        $(_that).parents('tr').remove();
                    }
                },
                complete: function (d) {
                    JsUtils.hideLoader('#list_related_product');
                },
                cache: false
            }); //end .ajax call
        });
    });

</script>
<div class="options">
        <input type="button" value="Thêm sản phẩm liên quan" class="adminButtonBlue addProductRelate"/>
</div>
<table class="tablestyle" cellspacing="0" rules="all" border="1" style="width: 100%;
    border-collapse: collapse;" id="list_related_product">
    <tbody>
        <tr class="headerstyle">
            <th scope="col">
                Tên sản phẩm
            </th>
            <th align="center" scope="col">
               Xem
            </th>
            <th align="center" scope="col">
                Thứ tự hiển thị
            </th>
            <th align="center" scope="col">
              
            </th>
        </tr>
        @if (Model != null && Model != null)
        {
            foreach (var p in Model)
            {
            <tr class="rowstyle">
                <td style="width: 60%;">                   
                        <input type="hidden" id="rel-@p.product2.id"/><label for="">@p.product2.name</label>
                </td>
                <td align="center" style="width: 15%;">
                    <a href="/admin/Product/addupdateproduct/@p.product2.id" title="View product details">Xem</a>
                </td>
                <td align="center" style="width: 15%;">
                    <input name="" type="text" value="@p.display_order" id="" class="adminInput" style="width: 50px;"/>
                </td>
                <td align="center" style="width: 10%;">
                    <a href="javascript:void(0);" relate-product-id="@p.id" class="delete-relate-product" title="Xóa khỏi danh sách liên quan">Xóa</a>
                </td>
            </tr>  
            }
        }
    </tbody>
</table>
@{ Html.Telerik().Window()
        .Name("RelatedProductContainer")
        .Title("Thêm sản phẩm liên quan")
        .Content(@<text>
    <div id="" style="">
        <table width="100%">
            <tbody>
                <tr>
                    <td class="adminTitle">
                        <span title="A product name.">Tên sản phẩm:</span>
                    </td>
                    <td class="adminData">
                        <input name="product_name" type="text" id="product_name" class="adminInput">
                    </td>
                </tr>
                <tr>
                    <td class="adminTitle">
                        <span id="" title="Search by a specific category.">Loại:</span>
                    </td>
                    <td class="adminData">
                        <select name="category_name" id="category_name" class="adminInput">
                            <option selected="selected" value="0">All</option>
                        </select>
                    </td>
                </tr>
            </tbody>
        </table>
        <div class="options">
            <input type="button" value="Tìm" id="btnSearchRelatedProduct" class="adminButtonBlue" />
        </div>
        <div style="width: 100%; min-height: 240px;">
        <table class="tablestyle" cellspacing="0" rules="all" border="1" id="result_list_related_products"
            style="width: 100%; border-collapse: collapse;">
            <thead>
                <tr class="headerstyle">
                    <th scope="col">
                        Tên sản phẩm
                    </th>
                    <th align="center" scope="col">
                    </th>
                </tr>               
            </thead>
            <tbody>
            </tbody>
        </table>
        </div>
        <div class="options">
            <input type="button" value="Đồng ý" id="btnSaveRelatedProduct" class="adminButtonBlue" />
            <a href="#" class="closeRelateProduct">Đóng</a>
        </div>
    </div>
    </text>)
        .Height(350)
        .Width(500)
        .Draggable(true)
        .Modal(true)
        .Visible(false)
        .Render();
}

